<template>
  <template v-for="item in list" :key="item.path">
      <!-- 如果item有children 引用一个组件 -->
      <template v-if="item.children">
        <el-sub-menu :index="item.path" >
                  <template #title>
                    <el-icon v-if="item.icon"><component :is="item.icon"/></el-icon>
                    <span>{{item.name}}</span>
                  </template>
                  <MenuList :list="item.children"></MenuList>
        </el-sub-menu>        
      </template>
      <el-menu-item :index="item.path" v-else>
                <el-icon v-if="item.icon"> <component :is="item.icon"/> </el-icon>
                <template #title>{{item.name}}</template>
      </el-menu-item>
      <!-- 如果没有就渲染 -->
  </template>
</template>
<script setup>
defineProps({
  list:{type:Array,default:()=>[]}
})
</script>